import { createRouter, createWebHistory } from 'vue-router'
import staff from './views/staff/staff.vue'
const router = createRouter({
    // 4. 内部提供了 history 模式的实现。为了简单起见，我们在这里使用 hash 模式。
    history: createWebHistory(),
    routes: [
        {
            path: '/login',
            name: 'login',
            meta: { requiresAuth: false, title: '登录' },
            component: () => import('./views/login/login.vue'),
        },
        {
            path: '/',
            name: 'home',
            meta: { requiresAuth: true, title: '首页' },
            component: () => import('./views/home/home.vue'),
            redirect: { name: 'staff' },
            children: [
                {
                    path: 'overview',
                    name: 'overview',
                    meta: { requiresAuth: true, title: '概览' },
                    component: () => import('./views/overview/overview.vue'),
                },
                {
                    path: 'staff/staff',
                    name: 'staff',
                    meta: { requiresAuth: true, title: '人员' },
                    component: () => import('./views/staff/staff.vue'),
                },
                {
                    path: 'staff/depart',
                    name: 'depart',
                    meta: { requiresAuth: true, title: '部门' },
                    component: () => import('./views/staff/depart.vue')
                },
                {
                    path: 'staff/promission',
                    name: 'promission',
                    meta: { requiresAuth: true, title: '权限' },
                    component: () => import('./views/staff/promission.vue')
                },
                {
                    path: 'device',
                    name: 'device',
                    meta: { requiresAuth: true, title: '设备' },
                    component: () => import('./views/device/device.vue')
                },
                {
                    path: 'device/deviceDetail/:id',
                    name: 'deviceDetail',
                    meta: { requiresAuth: true, title: '设备详情' },
                    component: () => import('./views/device/deviceDetail.vue')
                },
                {
                    path: 'grid',
                    name: 'grid',
                    meta: { requiresAuth: true, title: '布局' },
                    component: () => import('./views/grid/grid.vue')
                },
                {
                    path: 'utils',
                    name: 'utils',
                    meta: { requiresAuth: true, title: '封装测试' },
                    component: () => import('./views/utils/utils.vue')
                },
                {
                    path: 'drag',
                    name: 'drag',
                    meta: { requiresAuth: true, title: '拖放' },
                    component: () => import('./views/drag/drag.vue')
                },
                {
                    path: 'svg',
                    name: 'svg',
                    meta: { requiresAuth: true, title: 'svg' },
                    component: () => import('./views/svg/svg.vue')
                },
            ]
        },
    ], // `routes: routes` 的缩写
})
// 拦截
router.beforeEach((to, from, next) => {
    if (to.requiresAuth) {
        if (localStorage.getItem('loginName')) {
            next()
        } else {
            next({ name: 'login' })
        }
    } else {
        next()
    }
})
export default router